<%--
  Created by IntelliJ IDEA.
  User: SXT
  Date: 2020/6/29
  Time: 10:52
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <base href="<%=request.getContextPath()+"/"%>">
    <%--引入easyui主题的css样式--%>
    <link rel="stylesheet" href="easyui/themes/default/easyui.css">
    <%--引入easyui中图标集的css样式--%>
    <link rel="stylesheet" href="easyui/themes/icon.css">
    <%--引入demo.css--%>
    <link rel="stylesheet" href="easyui/themes/demo.css">
    <%--引入jq中js文件  注意：先引入jq中js在引入easyui中js--%>
    <script type="text/javascript" src="easyui/jquery.min.js"></script>
    <%--引入easyui中核心js文件--%>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>

    <script type="text/javascript" src="js/getJSON.js"></script>

    <script type="text/javascript">

         $(function () {
             $('#dg').datagrid({
                 url:'marriedPerson/findMarriedPersonsLer',
                 pagination:true,//设置分页栏展示
                 rownumbers:true,//设置行号显示
                 pageSize:5,//设置size的初始大小
                 pageList:[5,10,15,20],// 设置每一页显示条数列表
                 columns:[[
                     {field:'pid',title:'编号',width:100,align:'center'},
                     {field:'pname',title:'新人名称',width:150,align:'center'},
                     {field:'pmail',title:'邮箱',width:150,align:'center'},
                     {field:'pphone',title:'手机号',width:100,align:'center'},
                     {field:'status',title:'账号状态',width:100,align:'center'}
                 ]]
             });

             //需要条件查询在数据网格里显示数据,要结合这个方法,获取json格式的数据,写在
             //数据网格打开的方法里面
             $("#btn1").click(function () {
                 var arr = $("#fm1").serializeArray();
                 var json={};
                 for (var i in arr){
                     json[arr[i].name]=arr[i].value;
                 }
                 //给数据网格json数据,重新加载数据网格
                 $("#dg").datagrid("load",json);
             })
         })

    </script>
</head>
<body>

<div style="width: 800px;height: 600px" class="easyui-panel" title="婚庆公司管理">
    <%--顶部搜索框--%>
    <div style="width: 500px;height: 40px;border: 0px solid red;margin: 0px auto;margin-top: 30px">

        <form id="fm1">
            <input class="easyui-textbox" name="pname" data-options="prompt:'新人名称'" style="width:150px">
            <input class="easyui-textbox" name="pphone" data-options="prompt:'新人手机号'" style="width:150px">
            <a id="btn1" href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="margin-left: 30px">查询</a>
        </form>

    </div>
    <%--底部信息展示位置--%>
    <div style="width: 750px;height: 400px;border: 0px solid red;margin: 0px auto;margin-top: 30px">

        <table id="dg" style="width: 750px;height: 400px"></table>

    </div>

</div>

</body>
</html>
